<template>
  <div style="display: inline-block;width:100%">
    <el-select v-model="id" filterable reserve-keyword placeholder="请选择课程" :filter-method="dataFilter"
      @change="change" clearable :disabled='disabled'>
      <el-option v-for="item in EmpOptions" :key="item.lessionid" :label="item.lessionname" :value="item.lessionid">
      </el-option>
    </el-select>
  </div>
</template>
<script>
import {findLessions} from "@/api/user";
export default {
  name: 'checkLessions',
  props: {
    itemId: {
      type: [String, Number],
      default: ''
    },
    disabled: {
      type: Boolean,
      default: false
    },
  },
  data() {
    return {
      empname: '',
      id: '',
      EmpOptions: [],
      EmpOptionsCopy: [],
    }
  },
  watch: {
    itemId(n) {
      this.id = this.itemId
    }
  },
  mounted() {
    this.id = this.itemId
    this.getEmpid()
  },
  methods: {
    change(val) {
      this.$emit('checkedItem', val)
      this.$emit('checkedItemObj', this.EmpOptionsCopy.find(e=>e.lessionid === val))
    },
    async getEmpid() {
      const res = await findLessions.post({ pageNum: 1, pageSize: 3000 });
      if (res.resultCode === "000000") {
        this.EmpOptions = res.data;
        this.EmpOptionsCopy = res.data;
      } else {
        this.$message.error(res.resultInfo);
      }
    },
    dataFilter(val) {
      if (val) { //val存在
        this.EmpOptions = this.EmpOptionsCopy.filter((item) => {
          if (item.lessionname.indexOf(val) > -1 ) {
            return true
          }
        })
      } else { //val为空时，还原数组
        this.EmpOptions = this.EmpOptionsCopy;
      }
    }
  }
}
</script>
<style lang='scss' scoped>
</style>